<template>
  <a-modal v-model:visible="visible"
           centered
           :closable="false"
           :keyboard="false"
           :maskClosable="false"
           :title="$t('core.model.division.removeTitle')">
    <template #footer>
      <a-button key="back" @click="visible = false" :disabled="disableBut">
        {{ $t('core.model.division.removeBut1') }}
      </a-button>
      <a-button key="submit" type="primary" @click="removeSubmit(1)" :disabled="disableBut" :loading="loading1">
        {{ $t('core.model.division.removeBut2') }}
      </a-button>
      <a-button key="submit" type="primary" @click="removeSubmit(2)" :disabled="disableBut" :loading="loading2">
        {{ $t('core.model.division.removeBut3') }}
      </a-button>
    </template>
    <h3 style="font-weight: 900">{{ $t('core.model.division.removeMsg') }}</h3>
    <ul style="margin-top: 20px;">
      <li>
        <b style="color: red">{{ $t('core.model.division.removeMsg1') }}</b>
        <span style="font-weight: 700;font-size: 15px;">{{ $t('core.model.division.removeMsg2') }}</span>
        <ul style="list-style-type: none">
          <li>
            {{ $t('core.model.division.removeMsg4') }}
            <b>{{ $t('core.model.division.removeMsg6') }}</b>
            {{ $t('core.model.division.removeMsg8') }}
          </li>
        </ul>
      </li>
      <li>
        <b style="color: red">{{ $t('core.model.division.removeMsg3') }}</b>
        <span style="font-weight: 700;font-size: 15px;">{{ $t('core.model.division.removeMsg2') }}</span>
        <ul style="list-style-type: none">
          <li>
            {{ $t('core.model.division.removeMsg5') }}
            <b>{{ $t('core.model.division.removeMsg7') }}</b>
            {{ $t('core.model.division.removeMsg9') }}
          </li>
        </ul>
      </li>
    </ul>
  </a-modal>
</template>

<script>
  import {divisonApi} from '@/api/core/division';
  import {message} from 'ant-design-vue';

  export default {
    name: 'RemoveModel',
    data () {
      return {
        visible: false,
        disableBut: false, // 完全删除按钮、区划删除按钮、取消删除按钮是否可操作
        loading1: false, // 完全删除按钮是否显示加载状态
        loading2: false, // 区划删除按钮是否显示加载状态
        selectedRowKeys: [], // 选中的数据唯一标识集合

      }
    },
    methods: {
      open(selectedRowKeys) {
        this.visible = true
        this.selectedRowKeys = selectedRowKeys
      },
      // 删除提交
      removeSubmit(type) {
        this.disableBut = true
        const that = this
        // 完全删除
        if (type === 1) {
          this.loading1 = true
        } else {
          // 区划删除
          this.loading2 = true
        }

        divisonApi.remove({
          ids: this.selectedRowKeys,
          type: type
        }).then((res) => {
          if (res.code === 1000){
            message.success('删除行政区划成功')
          } else {
            message.warn(res.msg)
          }
          that.loading1 = false
          that.loading2 = false
          that.disableBut = false
          that.visible = false
          that.pageNo = 1
          that.$emit('submit')
        })

      }
    }
  }
</script>

<style scoped>

</style>